<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1">
    <!-- Google Chrome Frame也可以让IE用上Chrome的引擎: -->
    <meta name="renderer" content="webkit">
    <!--国产浏览器高速模式-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="author" content="穷在闹市"/>
    <!-- 作者 -->
    <meta name="revised" content="穷在闹市.v3, 2019/05/01"/>
    <!-- 定义页面的最新版本 -->
    <meta name="description" content="网站简介"/>
    <!-- 网站简介 -->
    <meta name="keywords" content="搜索关键字，以半角英文逗号隔开"/>
    <title>穷在闹市出品</title>

    <!-- 公共样式 开始 -->
    <link rel="stylesheet" type="text/css" href="../../css/base.css">
    <link rel="stylesheet" type="text/css" href="../../fonts/iconfont.css">
    <script type="text/javascript" src="../../framework/jquery-1.11.3.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../../layui/css/layui.css">
    <script type="text/javascript" src="../../layui/layui.js"></script>
    <script src="../../framework/cframe.js"></script><!-- 仅供所有子页面使用 -->
    <!-- 公共样式 结束 -->

</head>

<body>
<div class="cBody">
    <table class="layui-table">
        <thead>
        <tr>
            <th>规格名称</th>
            <th>商品图片</th>
            <th>参考价格</th>
            <th>商品单位</th>
            <th>一级分类</th>
            <th>二级分类</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td>HTML 5</td>
            <td><img src="../../images/goodsPIC1.png" width="20" height="20" onmouseenter="imgBig(this)"
                     onmouseleave="imgSmall(this)"/></td>
            <td>10</td>
            <td>斤</td>
            <td>前端</td>
            <td>技术</td>
            <td>
                <button class="layui-btn layui-btn-xs" onclick="updateBut()">修改</button>
                <button class="layui-btn layui-btn-xs" onclick="specificationsBut()">规格</button>
            </td>
        </tr>
        <tr>
            <td>HTML 5</td>
            <td><img src="../../images/goodsPIC2.png" width="20" height="20" onmouseenter="imgBig(this)"
                     onmouseleave="imgSmall(this)"/></td>
            <td>10</td>
            <td>斤</td>
            <td>前端</td>
            <td>技术</td>
            <td>
                <button class="layui-btn layui-btn-xs" onclick="updateBut()">修改</button>
                <button class="layui-btn layui-btn-xs" onclick="specificationsBut()">规格</button>
            </td>
        </tr>
        <tr>
            <td>HTML 5</td>
            <td><img src="../../images/goodsPIC3.png" width="20" height="20" onmouseenter="imgBig(this)"
                     onmouseleave="imgSmall(this)"/></td>
            <td>10</td>
            <td>斤</td>
            <td>前端</td>
            <td>技术</td>
            <td>
                <button class="layui-btn layui-btn-xs" onclick="updateBut()">修改</button>
                <button class="layui-btn layui-btn-xs" onclick="specificationsBut()">规格</button>
            </td>
        </tr>
        </tbody>
    </table>

    <form id="addForm" class="layui-form" action="" style="width: 60%;">
        <div class="layui-form-item">
            <label class="layui-form-label">商品名称</label>
            <div class="layui-input-block">
                <input type="text" name="goodsName" required lay-verify="required" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">单位</label>
            <div class="layui-input-block">
                <input type="text" name="company" required lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">参考价格</label>
            <div class="layui-input-block">
                <input type="text" name="price" required lay-verify="required|number" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">型号</label>
            <div class="layui-input-block">
                <input type="password" name="password" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">规格</label>
            <div class="layui-input-block">
                <input type="password" name="password2" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">描述</label>
            <div class="layui-input-block">
                <textarea name="desc" class="layui-textarea"></textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">分类</label>
            <div class="layui-input-inline">
                <select name="provid" id="provid" lay-filter="provid">
                    <option value="">一级分类</option>
                </select>
            </div>
            <div class="layui-input-inline">
                <select name="cityid" id="cityid" lay-filter="cityid">
                    <option value="">二级分类</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="radio" name="sex" value="nan" title="启用">
                <input type="radio" name="sex" value="nv" title="禁用" checked>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="submitBut">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>


    <script>
        layui.use(['upload', 'form'], function () {
            var form = layui.form;
            var upload = layui.upload;
            //监听提交
            form.on('submit(submitBut)', function (data) {
                layer.msg(JSON.stringify(data.field));
                return false;
            });
            form.verify({
                //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
                ZHCheck: [
                    /^[\u0391-\uFFE5]+$/
                    , '只允许输入中文'
                ]
            });
        });
    </script>

</div>
</body>

</html>